<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="/template/template.xhtml"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<ui:define name="head">
<link href='/resources/bootstrap/css/bootstrap-responsive.min.css' rel='stylesheet' />
<link href='/resources/plugins/datatables/dataTables.bootstrap.css' rel='stylesheet' />
<link href='/resources/bootstrap/css/bootstrap-datetimepicker.min.css' rel='stylesheet' />
<link href='/emap/resources/css/map.css' rel='stylesheet' />

<script type="text/javascript" src="/resources/primefaces/jquery/jquery.js"></script>
<script type="text/javascript" src="resources/plugins/echarts/echarts.min.v4.0.4.js"></script>
</ui:define>
	<ui:define name="content">
	<div style="position:relative;height:100%;">
		<div id="mapid" style="width: 100%; height: 300px;border: 1px solid #3473b7;"></div>
		<div class="input-group margin search-box">
			<input type="text" id="input_search" class="form-control"
				data-provide="typeahead" data-items="100" /> <span
				class="input-group-btn">
				<button type="button" id="btn_search"
					onclick="searchObj.search($(this).parent().prev().prev().val());"
					class="btn btn-info btn-flat">搜索</button>
			</span>
		</div>
		<div class="btn-group toolbar-box ">
			<button type="button" title="测距" onclick="distanceMeasure()" class="btn btn-default btn-flat">
				<img src="/resources/img/map/ruler.png"></img>
			</button>
			<button type="button" title="矩形查询" onclick="drawQueryRectangle()"
				class="btn btn-default btn-flat">
				<i class="fa fa-clone"></i>
			</button>
			<button type="button" title="清除" onclick="clearAll(true)" class="btn btn-default btn-flat">
				<i class="fa fa-repeat"></i>
			</button>
			<button type="button" title="擦除搜索结果" onclick="searchObj.clear();" class="btn btn-default btn-flat">
				<i class="fa fa-eraser" />
			</button>
		</div>
		<div id="affectObjDiv" class="weatherBox box box-success"></div>
		<div id="btnBox" class="btn-box">
			<ul class="btn-box-left">
				<li><a id="collapseBtn" class="btn-collapse" data-toggle="collapse" href="#btnBoxLeft"
					onclick="MapBtnUtil.changeStatus(this)"> <img id="myLogo" />
				</a></li>
			</ul>
			<ul class="btn-box-left collapse in " id="btnBoxLeft">
				<c:forEach var="item" items="#{indexPageMenuManagerController.funcList}">
					<li><c:choose>
							<c:when test="#{item.event!=null}">
								<a href="#{item.url}" onclick="MapBtnUtil.showChildren(this);#{item.event}"
									class="btn btn-app btn-col"> <span id="#{item.id}num" class="badge bg-red"></span> <i
									class="#{item.icon}"></i>#{indexPageMenuManagerController.getLocaleString(item)}
								</a>
							</c:when>
							<c:when test="#{item.event==null}">
								<a href="#{item.url}" onclick="MapBtnUtil.showChildren(this)"
									class="btn btn-app btn-col notChangeColor" style="cursor: default"> <span
									id="#{item.id}num" class="badge bg-red"></span> <i class="#{item.icon}"></i>#{indexPageMenuManagerController.getLocaleString(item)}
								</a>
							</c:when>
						</c:choose> <c:if test="#{item.subFunctions.size() != 0}">
							<ul class="sub-menu">
								<c:forEach var="sitem" items="#{item.subFunctions}">
									<li><a href="#{sitem.url}" onclick="#{sitem.event}"
										class="btn btn-app btn-col btn-second"> <span id="#{sitem.id}num"
											class="badge bg-red"></span> <i class="#{sitem.icon}"></i>#{indexPageMenuManagerController.getLocaleString(sitem)}
									</a></li>
								</c:forEach>
							</ul>
						</c:if></li>
				</c:forEach>
			</ul>
		</div>
	</div>
</ui:define>
<ui:define name="contentend">
		<script src="mapBtn.js"></script>
		<script src="map.js"></script>
		<script>
		function drawQueryRectangle(){
			map._chart.dispatchAction({
			    type: 'brush',
			    areas: [
					{
					    geoIndex: 0, // 指定此选框属于 index 为 0 的 geo 坐标系。
					                 // 也可以通过 xAxisIndex 或 yAxisIndex 来指定此选框属于直角坐标系。
					                 // 如果没有指定，则此选框属于『全局选框』。不属于任何坐标系。
					                 // 属于『坐标系选框』，可以随坐标系一起缩放平移。属于全局的选框不行。
					    brushType: 'rect', // 指定选框的类型。还可以为 'rect', 'lineX', 'lineY'
					    coordRange: [ // 如果是『坐标系选框』，则使用 coordRange 来指定选框的范围。
					        [106,108],[23,25]
					        // 这个例子中，因为指定了 geoIndex，所以 coordRange 里单位是经纬度。
					    ]
					}
				]
			});
		}
		</script>
</ui:define>
</ui:composition>